import { Component } from 'react';
import { View, Image } from '@tarojs/components'
import tipsImg from '@/utils/global'
import './index.scss'

interface Props {
    title?: string
    subTitle?: string
    btnText?: string
    handleEvent?: any
}

export default class EmptyView extends Component<Props, any> {

    constructor(props) {
        super(props)
    }

    UNSAFE_componentWillMount() { }

    componentDidMount() { }

    UNSAFE_componentWillReceiveProps(nextProps, nextContext) { }

    componentWillUnmount() { }

    componentDidShow() { }

    componentDidHide() { }

    componentDidCatchError() { }

    componentDidNotFound() { }

    handleEvent() {
        const {
            handleEvent
        } = this.props
        handleEvent()
    }

    render() {
        const {
            title,
            subTitle,
            btnText
        } = this.props
        return (
        <View className='empty-container'>
            <Image className='img-container' mode='widthFix' src={tipsImg}></Image>
            <View className='shadow'></View>
            <View className='content'>
                <View className='content-title'>{title}</View>
                <View className='sub-title'>{subTitle}</View>
            </View>
            { btnText && <View className='handle-btn' onClick={() => this.handleEvent()}>{btnText}</View>}
        </View>
        )
    }
}
